<template>
    <Tabbar v-model="activeindex" @change="(key: string) => onSelect(key)">
        <template v-for="map, index in options" :key="index">
            <TabbarItem :icon="map.img" :name="map.router">
                {{ map.name }}
            </TabbarItem>
        </template>
    </Tabbar>
</template>
<script lang="ts" setup>
import { Tabbar, TabbarItem } from "vant";
import { ref, watch } from "vue";
import { useRouter } from "vue-router";
interface prop {
    options: interfaceMenu[]
    activeIndex: number
}
const router = useRouter()
defineEmits(["select"])
const props = defineProps<prop>()
const activeindex = ref(props.activeIndex)
watch(() => props.activeIndex, (val) => {
    activeindex.value = val
})
const onSelect = (key: string) => {
    router.push(key)
}
</script>